<%@page import="net.sf.json.JSON"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>

<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			
			*{
				padding: 0;
				
				margin: 0;
			}
			a{
				text-decoration: none;
			}
			
			#box{
				width: 100%px;
				
				height: 740px;
				
				background-color: white;
				
				border: 1px solid black;
				
				margin: 0 auto;
			}
			input{
			-web-kit-appearance:none;

           -moz-appearance: none;
			}

			
			#biaot{
				position: relative;
				
				top: 50px;
				
				left: 0px;
				
				color: #00CCFF;
				
				font-size: 250%;
				
				font-weight: normal;
				
				font-family: "arial black";
				
				/* border: 1px solid black; */
				
				text-align: center;
			}
			#kkk{
				width: 1000px;
				height: 510px;
				border: 1px solid powderblue;
				margin: 0 auto;
				position: relative;
				top: 100px;
			}
			/* 搜索框的父级 */
			#biaotx{
				position: relative;
				
				top: 70px;
				
				left: 11px;
				

				height: 100px;
				
				width: 500px;
			}
			/* 搜索框 */
			input{
				width: 240px;
				
				height: 28px;
				
				position: relative;
				
				left: 22px;
				
				border-top-left-radius:7px;
				
				border-bottom-left-radius:7px;
				
				color:grey ;
				
				outline: none; 
				
				border: 2px solid whitesmoke;
				z-index: 5;
				
				font-size:13px;
				   ;
			}
			.k:hover{
				
				-webkit-box-shadow:0 1px 3px 0 rgba(0,0,0,.2);
			}
			/* 搜索 */
			#search{
			
			    width: 52px;
			
			    height: 32px;
			
				
				position: relative;
				
				top: -33px;
				
				left: 320px;
			
			    background:#55CCFF;
			
			    color: white;
			
			    text-align: center;
			
			    line-height: 33px;
			
			    cursor: pointer;
				
				border-top-right-radius:7px;
				
				border-bottom-right-radius:7px;
			}
			#search:hover{
				
				background-color: #00CCFF;
			}
			#ss{
				color: white;
			}
			#zi{
				width: 100%;
				height: 170px;
				position: relative;
				top: 190px;
				left: 30px;
				/* border: 2px solid whitesmoke; */
				
			}
			#zi{
				color: darkgrey;
			}
			
			
			#biaoty{
				width: 320px;
				height: 300px;
				/* border: 1px solid red; */
				float: right;
				position: relative;
				top: -20px;
			}
			#zy{
				width: 500px;
				height: 40px;
				line-height: 40px;
				color: #00CCFF;
				position: relative;
				top: -130px;
				left:30px;
			}
			#ss{
			
				width: 70px;
				height: 31px;
				background-color: #00CCFF;
				border:1px solid #00CCFF;
				position: relative;
				left: 13px;
				top: 1px;
				border-top-right-radius:6px;/*右上弧度10像素*/
				
				border-bottom-right-radius:6px;/*右下弧度10像素*/
				
				z-index: 1;
			}
			
			#zy{
			
			}
		</style>
	</head>
	<body>
		
		<div id="box">
			
			
			<div id="biaot">
				身份证查询
			</div>
			
			<div id="kkk">
				<div id="biaotx">
					
					<form action="/sfz" method="GET">
					<input name="k" type="text" autofocus="autofocus" placeholder="请输入正确的身份证号">
					<input type="submit" value="查询"/ id="ss" onclick="gaibian()">
					<!-- <div id="search"><a id="ss" href="sfz?suffix=">搜索</a></div>  -->
					</form>
				</div>
				<div id="biaoty">
					<img src="/img/程序.png" id="pp" >
					<!-- <video>
						<source src="D:\浏览器默认下载地址" type="video/mp4"></source>
						
					</video> -->
				</div>
				
				 <div id="zi">
					<span>
						郑重声明：
					</span><br>
					<br>
					1.通过该查询服务，您可以通过输入您的身份证号码查询到您本人的部分身份信息；<br>
					2.为保护他人的隐私，不建议您查询他人的身份信息或者将他人的身份信息予以传播；<br>
					3.如需查询他人的详细身份信息，请依据相关规定至相关部门查询；<br>
					4.该身份证号码查询系统提供的信息仅供参考；<br>
					5.本网站不会泄露任何个人隐私；<br>
					6.请在查询前阅读本声明，点击查询后即视为您已阅读并同意本声明的内容；
				</div>
				<div id="zy">
					<p>身份证号:<em></em></p>
					<p>地址:<em1></em1></p>
					<p>生日:<em2></em2></p>
					<p>性别:<em3></em3></p>
				</div>
			</div>
			
		</div>
		
	</body>
	
	<script src="js/jQuery.min.js" type="text/javascript" charset="utf-8"></script>

   <script type="text/javascript">
   function isObject(obj) {
	    return Object.prototype.toString.call(obj) === '[object Object]'
	}
   $("#zy").hide();
	var json=${sfzh};
	if(json["msg"]!="没有找到对应数据"){
		console.log(1)
		$("#zy p em").text(json["data"]["idCardNum"]);
		$("#zy p em1").text(json["data"]["address"]);
		$("#zy p em2").text(json["data"]["birthday"]);
		$("#zy p em3").text(json["data"]["sex"]);
		$("#zy").toggle();
	}
	console.log(json);
	 
	 
	 
   </script>
</html>
